<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <%- include ../taglibs/layout_head.ejs%>
    <%- include ../taglibs/layout.css.ejs%>
    <link href="js/plugins/zTree/css/metroStyle/metroStyle.css" rel="stylesheet">
</head>
<body>
<%-include("../taglibs/header.ejs",{params:{className:"active",reportIsActive:"true"}})%>
<div class="nav-body" id="divContent">
    <div class="nav-box">
        <div class="row">
            <div class="col-sm-4 col-md-3 col-lg-2 nav-box-left-box">
                <%-include("reportManageLeftMenu.ejs",{params:{className:"active",danagerreport:"true"}})%>
            </div>
            <div class="col-sm-6 col-md-9 col-lg-10 right-container-box">
                <ol class="head-breadcrumb">
                    <li>
                        <a>数据报表</a>
                    </li>
                    <li class="active">
                        警情报表
                    </li>
                </ol>
                <div class="right-container"  style="margin-top: 25px">
                    <section class="content content-search">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="col-sm-12 col-md-10">
                                    <div class="col-sm-12 col-md-12 content-search-left">
                                        <input type="hidden" id="warningDeptId">
                                        <input type="text" name="carids" id="carids" hidden="hidden">
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                开始时间：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control   layer-date " id="start" name="start">
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                结束时间：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control   layer-date " id="end" name="end">
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                用户：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control" id="warningDeptName" name="deptName" style="padding-right: 54px">
                                                <button type="button" class="btn btn-theme selectUser"
                                                        style="position: absolute;top: 0px;right: 0px;">选择</button>
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                车牌号：
                                            </label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control" id="baseCarNo" name="baseCarNo">
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                报警类型：
                                            </label>
                                            <div class="col-sm-8">
                                                <select type="text" class="form-control" id="waringtype" name="waringtype">
                                                    <option value="">请选择</option>
                                                    <option value="1">驶入</option>
                                                    <option value="2">驶出</option>
                                                    <option value="3">超速</option>
                                                    <option value="4">路线偏离</option>
                                                    <option value="5">停车超时报警</option>
                                                    <option value="6">疲劳驾驶报警</option>
                                                    <option value="7">凌晨行车报警</option>
                                                    <option value="8">断电报警</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-sm-12 col-md-6 col-lg-4 content-search-left-box">
                                            <label class="col-sm-4">
                                                处理状态：
                                            </label>
                                            <div class="col-sm-8">
                                                <select type="text" class="form-control" id="waringstate" name="waringstate">
                                                    <option value="0">未处理</option>
                                                    <option value="1">已处理</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-12 col-md-2 " >
                                    <div class="col-sm-12 col-md-12 " >
                                        <button type="button" class="btn btn-round btn-theme" id="do_search" style="margin-bottom: 3px;margin-top: 3px">查 询</button>
                                        <button type="button" class="btn btn-round btn-danger" id="do_reset" style="margin-bottom: 3px;margin-top: 3px">重 置</button>
                                    </div>
                                    <div class="col-sm-12 col-md-12 " >
                                        <button type="button" class="btn btn-round btn-theme"   onclick="openExport()">导出列表</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                    <section class="content content-table">
                        <!--<section class="content-table-tools">
                            <div class="tools-box">
                                <button type="button" class="btn btn-round btn-add">新 增</button>
                                <button type="button" class="btn btn-round btn-danger">删 除</button>
                            </div>
                        </section>-->
                        <div style="display: block">
                            <table id="jingqingbaobiao"></table>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="myTreeDialog">
    <div class="modal-dialog" style="width: 320px;">
        <div class="modal-content" style="width: 320px;">
            <div class="modal-header">
                <button type="button" class="close" onclick="closeTreeDialog()">×</button>
                <h4 class="modal-title" id="NoPermissionModalLabel">所属用户</h4>
            </div>
            <div class="modal-body" style="height:320px;max-height:320px;max-width: 320px;
                overflow: auto;">
                <ul id="userCommonTree" class="ztree">
                </ul>
            </div>
            <div class="modal-footer">
                <button class="btn btn-info"   type="button" onclick="getAllCheckNodes()">确 定</button>
            </div>
        </div>
    </div>
</div>
<%-include ../taglibs/layout.js.ejs%>
<script src="/js/plugins/zTree/js/jquery.ztree.all-3.5.js"></script>
<script src="/js/plugins/zTree/js/jquery.ztree.exhide-3.5.js"></script>
<script src="/js/ztree/ztree-cus-check.js"></script>
<script src="/js/ztree/ztree-user.js"></script>
<!--时间-->
<script src="js/plugins/layer/laydate/laydate.js"></script>
<script type="text/javascript" src="js/report/reportIndex.js"></script>
<!--<script type="text/javascript" src="js/viewpage/dataManage/userInfo/userInfo.js"></script>-->
<script type="text/javascript">
    var url = '/tree/dept';
    $(function () {
        //UserInfo.initUserPage();
        var dataTable = new BootstrapTable($('#jingqingbaobiao'),{
            url:"/jingqingreportManage/queryDuanDianReport",
            sidePagination: "server",
            singleSelect:true,
            queryParams:function (params) {
              var _params = {
                  baseCarNo:$("#baseCarNo").val(),
                  waringstate:$("#waringstate").val(),
                  start:$("#start").val(),
                  end:$("#end").val(),
                  deptId:$("#warningDeptId").val(),
                  waringType:$("#waringtype").val()
              }
              return $.extend(params,_params)
            },
            columns: [
                {
                    field: 'userName',
                    title: '车主姓名'
                },
                {
                    field: 'baseCarNo',
                    title: '车牌号',
//                    formatter:function (value,row,index) {
//                        return "<a style='color: #0ae;cursor: pointer' class='openMonitor' carid='"+row.carID+"' carno='"+row.baseCarNo+"'>"+value+"</a>"
//                    }
                },
                {
                    field: 'warningType',
                    title: '报警类型',
                    formatter:function (value,row,index) {
                        //e是得到的json数组中的一个item ，可以用于控制标签的属性。
//                    debugger;
                        var e = row;
                        var d = e.warningType;
//                    1-驶入  2-驶出 3-超速 4-路线偏离 5-停车超时报警  6-疲劳驾驶报警 7-凌晨行车报警
                        var result = "";
                        if (d == 1) {
                            result = '驶入报警'
                        } else if (d == 2) {
                            result = '驶出报警'
                        } else if (d == 3) {
                            result = '超速报警'
                        } else if (d == 4) {
                            result = '路线偏离报警'
                        } else if (d == 5) {
                            result = '停车超时报警'
                        } else if (d == 6) {
                            result = '疲劳驾驶报警'
                        } else if (d == 7) {
                            result = '凌晨行车报警'
                        }else if(d==8){
                            result = '断电报警'
                        }
                        return result
                    }
                },
                {
                    field: 'waringstate',
                    title: '处理状态',
                    formatter:function (value,row,index) {
                        var txt = "";
                        switch (parseInt(value)){
                            case 0:
                                txt = "未处理"
                                break;
                            case 1:
                                txt = "已处理"
                                break;

                        };
                        return txt
                    }
                },
                {
                    field: 'waringtime',
                    title: '报警时间'
                },
                {
                    field: 'endTime',
                    title: '恢复时间'
                },
                {
                    field: 'waringcontent',
                    title: '报警区域'
                },
                {
                    field: 'oneHigh',
                    title: '持续时间',
                    formatter:function (value,row,index) {
                        if(value){
                            return value+"分钟"
                        }
                        return "";
                    }
                },
//                {
//                    field: 'id',
//                    title: '操作',
//                    formatter:function (value,row,index) {
//                        var _waringstate = row.waringstate;
//                        if(parseInt(_waringstate) == 0){
//                            return "<a  class='oprationwarning warningOpration' rowid='"+row.id+"' rowtype='"+row.warningType+"'>报警处理</a>";
//                        }
//                        return ""
//                    }
//                }
            ]
        });
        dataTable.init();

        UserTreeComponents.initUserTree('id', 'parentId', 'name',clickTree,treeCheck, "radio");
        UserTreeComponents.loadUserTree(url,"userCommonTree",true)
        var start = {
            elem: '#start',
            format: 'YYYY-MM-DD hh:mm:ss',
//            min: laydate.now(), //设定最小日期为当前日期
            max: '2999-06-16 23:59:59', //最大日期
//            start: laydate.now(),
//            start: laydate.now() + ' 00:00:00',
            istime: true,
            istoday: false,
            festival: true, //是否显示节日
            choose: function (datas) {
                if(datas){
                    end.min =datas.substring(0,10)+" 00:00:00"
                    end.start = datas.substring(0,10)+" 00:00:00"
                }
//                end.min = datas; //开始日选好后，重置结束日的最小日期
//                end.start = datas //将结束日的初始值设定为开始日
            }
//            min: laydate.now(-1), //-1代表昨天，-2代表前天，以此类推
//            max: laydate.now(+1) //+1代表明天，+2代表后天，以此类推
        };
        var end = {
            elem: '#end',
            format: 'YYYY-MM-DD hh:mm:ss',
//            min: laydate.now(),
            max: '2999-06-16 23:59:59',
//            start: laydate.now() + ' 23:59:59',
            istime: true,
            istoday: false,
            festival: true, //是否显示节日
            choose: function (datas) {
                var st=$("#start").val();
                if(st>datas){
                    swal({
                        title: "系统提示",
                        text: "开始时间必须小于结束时间!",
                        type: "error"
                    });
//                    $("#end").val(laydate.now() + ' 23:59:59');
                }else{
                    start.max = datas.substring(0,10)+" 23:59:59"; //结束日选好后，重置开始日的最大日期
                }
            }
        };
        laydate(start);
        laydate(end);
        $("#start").val(laydate.now() + ' 00:00:00');
        $("#end").val(laydate.now() + ' 23:59:59');

        $(".selectUser").on("click",function () {
            $("#myTreeDialog").modal("show");
        });
        $("#do_search").click(function () {
            dataTable.refresh({
                query:{
                    baseCarNo:$("#baseCarNo").val(),
                    waringstate:$("#waringstate").val(),
                    start:$("#start").val(),
                    end:$("#end").val(),
                    deptId:$("#warningDeptId").val(),
                    waringType:$("#waringtype").val(),
                    isSearch:true
                }
            });
        });
        $("#do_reset").click(function () {
            $("#baseCarNo").val("");
            $("#waringstate").val("")
            $("#start").val("")
            $("#end").val("")
            $("#warningDeptId").val("")
            $("#waringtype").val("")
        });
    })

    function getAllCheckNodes() {
        var node = userTreeObj.getCheckedNodes(true)[0];
        if(node){
            $("#warningDeptName").val(node.name);
            $("#warningDeptId").val(node.id);
        }else{
            $("#warningDeptName").val("");
            $("#warningDeptId").val("");
        }
        closeTreeDialog();
    }
    function closeTreeDialog() {
        $("#myTreeDialog").modal("hide");
    }
    function clickTree(event, treeId, treeNode) {
//        debugger;
//        var flag=treeNode.checked;
//        tree_Obj.checkNode(treeNode, true, true);
//        selectTreeNode(treeNode);
    }
    function treeCheck(event, treeId, treeNode, clickFlag) {

    }
    function openExport() {
        window.location.href = window.serveraddr+"/tabWaringInfo/exportExcel?baseCarNo="+$("#baseCarNo").val()+"&waringstate="+$("#waringstate").val()+"&start="+$("#start").val()+"&end="+$("#end").val()+"&deptId="+$("#warningDeptId").val()+"&waringType="+$("#waringtype").val()
    }
</script>
</body>
</html>